<template>
  <div class="box">
    <p class="p_title">
      <el-button type="text" style="color: #000;font-size: 16px;float: left">历史登录记录</el-button>
      <el-date-picker
        v-model="times"
        type="daterange"
        align="right"
        unlink-panels
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        :picker-options="pickerOptions2"
        @change="fff(times)"
        style="float: right">
      </el-date-picker>
    </p>
    <el-table
      :data="tableData"
      border
      style="width: 100%;">
      <el-table-column
        align='center'
        prop="index"
        label="序号"
        width="60">
      </el-table-column>
      <el-table-column
        align='center'
        prop="displayName"
        label="用户姓名"
        width="150">
      </el-table-column>
      <el-table-column
        align='center'
        prop="account"
        label="账户"
        width="180">
      </el-table-column>
      <el-table-column
        align='center'
        prop="roleType"
        label="角色类型">
      </el-table-column>
      <el-table-column
        align='center'
        prop="loginIp"
        label="IP">
      </el-table-column>
      <el-table-column
        align='center'
        prop="loginTime"
        :formatter="$utils.dateFormat"
        label="时间">
      </el-table-column>
      <el-table-column
        align='center'
        prop="status"
        label="操作">
      </el-table-column>
    </el-table>
    <div style="width: 100%;margin: 20px 0;height: 40px;line-height: 40px">
      <div style="float: right">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                       :current-page="currentPage4" :page-sizes="[10, 20, 30, 40, 50]" :page-size="10"
                       layout="total, sizes, prev, pager, next, jumper" :total=total></el-pagination>
      </div>
    </div>
  </div>
</template>
<script>
  import {$aos} from "../../../store/state";
  import {http} from "../../../assets/commonjs/axios";

  export default {
    name: "auditInfo",
    data(){
      return{
        times:'',
        pickerOptions2:[],
        userId:'',
        startTime:'',
        endTime:'',
        tableData:[],
        roleType:'',
        pgindex: 1,//当前页
        pages: 0,//每页条数
        currentPage4:1,
        total: 0,
      }
    },
    created(){
      $aos.getItem('loginData').then(res => {
        this.userId = res.role.userId;
        this.roleType = res.role.roleType;
        this.getInfo({})
      })
    },
    methods:{
      fff(val){
        if(val){
          let d1 = new Date(val[0]);
          this.startTime = d1.getFullYear() + '-' + (d1.getMonth() + 1) + '-' + d1.getDate();
          let d2 = new Date(val[1]);
          this.endTime = d2.getFullYear() + '-' + (d2.getMonth() + 1) + '-' + d2.getDate();
          this.getInfo({
            userId:'',
            startTime:this.startTime,
            endTime:this.endTime,
            pageIndex: '',
            pageNum: '',
          })
        }else{
          this.getInfo({})
        }
      },
      getInfo(val){
        const  params = {
          userId:val.userId || this.userId || '',
          startTime:val.startTime || '',
          endTime:val.endTime || '',
          pageIndex: val.pageIndex || this.pgindex || 1,
          pageNum: val.pageNum || this.pages || 10,
        }
        http('post','permission/list_operate',params).then(res=>{
          if (res.data.success) {
            let data = res.data.data;
            let projects = data.list || [];
            //保留this
            let _this = this
            projects.forEach(function (item, index) {
              //分页
              if (_this.pages == 0) {
                if (val.pageIndex > 1) {
                  item.index = (val.pageIndex - 1) * 10 + index + 1;
                } else {
                  item.index = index + 1
                }
              } else if (_this.pages != 0) {
                if (val.pageIndex > 1) {
                  item.index = (val.pageIndex - 1) * _this.pages + index + 1;
                } else {
                  item.index = index + 1
                }
              }
              if(_this.roleType  === 0){
                item.roleType = '超级管理员'
              }else if(_this.roleType  === 4){
                item.roleType = '普通用户'
              }else if(_this.roleType  === 5){
                item.roleType = '政府部门管理员'
              }
              // loginType   1应用系统登录   2权限系统登录
              if(item.loginType == 1){
                item.status = '应用系统登录'
              }else if(item.loginType == 2){
                item.status = '权限系统登录'
              }else{
                item.status = '权限系统登录'
              }

            })
            this.tableData = projects;
            this.total = data.total;
          }

        })
      },

      //改变每页条数事件
      handleSizeChange(val) {
        this.pages = val
        this.getInfo({
          userId:'',
          startTime:this.startTime,
          endTime:this.endTime,
          pageIndex: this.pgindex,
          pageNum: this.pages,
        })
      },
      //改变当前是第几页
      handleCurrentChange(val) {
        this.pgindex = val
        this.getInfo({
          userId:'',
          startTime:this.startTime,
          endTime:this.endTime,
          pageIndex: this.pgindex,
          pageNum: this.pages,
        })
      },


    },
  }

</script>
<style scoped>
  .box{
    background: #fff;
    padding: 0 30px 30px 30px;
  }
  .p_title{
    overflow: hidden;
    padding: 10px 40px 10px 20px;
    margin: 0;
  }
</style>
